import type { TextTrackInit } from "vidstack";

export const textTracks: TextTrackInit[] = [
  // Subtitles
  {
    src: "https://media-files.vidstack.io/sprite-fight/subs/english.vtt",
    label: "English",
    language: "en-US",
    kind: "subtitles",
    default: true,
  },
  {
    src: "https://media-files.vidstack.io/sprite-fight/subs/spanish.vtt",
    label: "Spanish",
    language: "es-ES",
    kind: "subtitles",
  },
  // Chapters
  {
    src: "https://media-files.vidstack.io/sprite-fight/chapters.vtt",
    kind: "chapters",
    language: "en-US",
    default: true,
  },
];
interface VideoMeta {
  id: number;
  title: string;
  src: string;
  poster: string;
  thumbnails: string;
  tracks: TextTrackInit[]
}
export const useVideoConstant = () => {
  return ref<VideoMeta>({
    id: 2,
    title: "一起构建一个Python Flask镜像",
    src: "/videos/4-8一起构建一个Python Flask镜像.mp4",
    poster: "https://image.mux.com/VZtzUzGRv02OhRnZCxcNg49OilvolTqdnFLEqBsTwaxU/thumbnail.webp?time=3&width=1200",
    thumbnails: "https://image.mux.com/VZtzUzGRv02OhRnZCxcNg49OilvolTqdnFLEqBsTwaxU/storyboard.vtt",
    tracks: textTracks,
  });
}

/**
 *
 * @example
 * ```html
 * <media-provider>
 *   <track label="..." src="..." kind="..." srclang="..." default />
 *   <track label="..." src="..." kind="..." srclang="..." />
 * </media-provider>
 * ```
 */
// for (const track of textTracks) playerElement.value!.textTracks.add(track);
